/**
* 描述：预览
*/
<style lang="scss" scoped>
  @import '../index';
</style>
<template>
  <div class="exportResume">
    <div class="exportResume-inner">
      <div class="exportResume-title">
        <div class="logo fl">
          <img src="/static/images/web/index/logo.png" width="74" height="78" alt="微职">
        </div>
        <a class="ex fr" style="margin-top:10px;">
        <!--<i class="iconUCenter iconUCenter_export fl" style="margin-top:5px;margin-left: 20px;"></i>-->
          <Icon type="arrow-return-right" style="float: left;font-size:24px;color:#85c0e0;margin-top:10px;margin-right:4px;"></Icon>
          <span v-go-back>返回</span>
          <span class="clear"></span>
        </a>
        <!--<a class="ex fr">-->
          <!--<i class="iconUCenter iconUCenter_export fl" style="margin-top:5px;margin-left: 20px;"></i>-->
          <!--<span>导出</span>-->
        <!--</a>-->
        <div class="clear"></div>
      </div>
      <div class="exportResume-main buleShadow">
          <div class="top">
            <!--基础信息-->
            <div style="background: #4f6c8f;">
              <div class="resumeCenter-block resumeCenter-userInfo" style="border-bottom: none;">
                <img :src="`/api/pub/image/${info.avatar}`" class="touxiang" v-show="info.avatar"/>
                <img src="/static/images/web/userCenter/userGirl.png"  class="touxiang" v-show="!info.avatar && info.sex===1">
                <img src="/static/images/web/userCenter/userBoy.png"  class="touxiang" v-show="!info.avatar && info.sex===2">
                <div class="center">
                  <div class="name">{{info.name}}</div>
                  <!--<a class="tag radius05">完全保密</a>-->
                  <div class="clear"></div>
                  <div class="info">
                    <i>{{info.sex | sexType}}</i><i>丨</i><i>21</i><i>（{{info.birth}}）</i><i>丨</i><i>{{form.workExperience | experience}}工作经验</i><i>丨</i><i>现居{{info.cityId | cityAndType}}</i><i>丨</i><i>{{info.job}}</i><i>丨</i><i>{{intentInfo.status | intentStatus}}</i>
                  </div>
                  <div class="clear"></div>
                  <div class="email">
                    <i class="iconUCenter iconUCenter_phone_yellow fl" style="margin-top:3px;"></i>
                    <i class="fl">{{info.phone}}</i>
                    <i class="iconUCenter iconUCenter_email_yellow fl" style="margin-top:5px;margin-left: 20px;"></i>
                    <i class="fl" v-show="info.email">{{info.email}}</i>
                    <i class="fl" v-show="!info.email">未填写</i>
                  </div>
                  <div class="clear"></div>
                </div>
                <div class="clear"></div>
              </div>
            </div>
            <!--求职意向-->
            <div style="background: #e3effd;color: #333;margin-top: -10px;padding-top:10px;">
              <div class="resumeCenter-block">
                <div class="resumeCenter-block-tit" style="margin-top:0;">求职意向</div>
                <div class="clear"></div>
                <div class="resumeCenter-main">
                  <span class="wth50">期望薪资：{{intentInfo.salaryHigh}}-{{intentInfo.salaryLow}}</span>
                  <span class="wth50">地点：{{intentInfo.cityId | cityAndType}}</span>
                  <span class="wth50">期望职位/职能：{{intentInfo.position | positionFilter}}</span>
                  <span class="wth50">到岗时间：一周内</span>
                  <span class="wth50">职位类型：{{intentInfo.type | intentType}}</span>
                  <div class="clear"></div>
                  <span class="wth100">自我评价：<br>
                      <p v-for="item in info.briefIntroList">{{item}}</p>
                  </span>
                  <div class="clear"></div>
                </div>
                <div class="clear"></div>
              </div>
              <div class="clear"></div>
            </div>
            <!--工作经验-->
            <div class="resumeCenter-block">
              <div class="resumeCenter-block-tit">工作经验</div>
              <div class="clear"></div>
              <div class="resumeCenter-main" v-for="(work, index) in allInfo.resumeList">
                <span class="wth100">{{index + 1}}公司名称：<i class="fbold">{{work.company}}</i></span>
                <div class="clear"></div>
                <span class="fl100" v-if="work.end">起始时间：{{work.start | formatDate}}&emsp;&emsp;至&emsp;&emsp;{{work.end | formatDate}}</span>
                <span class="fl100" v-if="!work.end">起始时间：{{work.start | formatDate}}&emsp;&emsp;至今</span>
                <div class="clear"></div>
                <span class="wth50">职位/职能：{{work.job}}</span>
                <div class="clear"></div>
                <span class="wth100">工作描述：<br><p v-for="it in work.descriptionList">{{it}}</p></span>
              </div>
            </div>
            <!--教育经历-->
            <div class="resumeCenter-block">
              <div class="resumeCenter-block-tit">教育经历</div>
              <div class="clear"></div>
              <div class="resumeCenter-main" v-for="(afo, index) in allInfo.educationList">
                <span class="wth100">{{index + 1}}毕业院校：<i class="fbold">{{afo.school}}</i></span>
                <div class="clear"></div>
                <span class="fl100">入学时间：{{afo.start | formatDate}}</span>
                <span class="fl100">毕业时间：{{afo.end | formatDate}}</span>
                <div class="clear"></div>
                <span class="wth100">学历学位：{{afo.degree | education}}</span>
                <div class="clear"></div>
                <span class="wth100">专业：{{afo.major}}</span>
              </div>
            </div>
            <!--简历附件-->
            <!--<div class="resumeCenter-block" style="border-bottom: 0;">-->
              <!--<div class="resumeCenter-main">-->
                <!--<span class="fl100">个人主页：<a href="http://www.baidu.com">http://www.baidu.com</a></span>-->
                <!--<div class="clear"></div>-->
              <!--</div>-->
            <!--</div>-->
            <div style="border-bottom:5px solid #4f6c8f;margin-top:40px;margin-bottom:50px;"></div>
          </div>
      </div>
    </div>
  </div>
</template>
<script>
  import { mapState, mapActions } from 'vuex';
  import { getIntent, getResumeAndIntent } from '@/service/web/user/userService';
  export default {
    computed: {
      ...mapState([
        'userInfo'
      ])
    },
    data () {
      return {
        // 个人基础信息
        info: {},
        intentInfo: {},
        allInfo: {},
        // 暂时定义
        work: {},
        afo: {},
        item: {},
        form: {}
      };
    },
    mounted () {
      this.getCurrentUser();
      this.getIntent();
      this.getAllInfo();
    },
    methods: {
      ...mapActions([
        'getUserInfo'
      ]),
      async getCurrentUser () {
        await this.getUserInfo();
        this.info = Object.assign({}, this.userInfo);
        this.info.briefIntroList = [];
        if (this.info.briefIntro) { // 格式化自我评价
          let briefIntro = this.info.briefIntro.replace(/\n/g, ';');
          this.info.briefIntroList = briefIntro.split(';');
        }
      },
      // 获取用户求职意向
      async getIntent () {
        let res = await getIntent();
        this.intentInfo = res.data;
      },
      // 获取所有其他
      async getAllInfo () {
        let res = await getResumeAndIntent();
        this.allInfo = res.data;
        if (this.allInfo.resumeList && this.allInfo.resumeList.length) {
          this.allInfo.resumeList.forEach(item => {
            let description = item.description.replace(/\n/g, ';');
            item.descriptionList = description.split(';');
          });
        }
      }
    }
  };
</script>
